<div class="gridIt"> </div>

<div id="next-page">
    <a id="next-page-url" href="#"><img id="next-page-img" src="<?php echo base_url(); ?>frontend_style/img/arrow-d.png" width="98" height="113" alt="Next page"/></a>
</div>

<h1 id="no-pages-to-show" class="big-title orange rnd7 sry" style="display: none;">

    <span>Nincs megjelenítendő hír!</span>
    <img class="sryImg rnd7 noShadow" src="<?php echo base_url(); ?>frontend_style/img/sry.png" width="60" height="60" alt="Next page"/>

</h1>

<script type="text/javascript" charset="utf-8">
    $(document).ready(function() {  
        // ennyiedik 'oldalon' tartunk
        var page = 1; 
        
        function load_hirek(from){
            $('#next-page-img').attr('src', '<?php echo base_url(); ?>frontend_style/img/load_anim_front.gif');
            $.ajax({
                url: '<?php echo site_url('hirek/get_hirek_ajax'); ?>',
                data: {
                    page : page
                },
                dataType: 'json',
                type: 'post',
                success: function (data) {
                    $(".gridIt").append(data.html).masonry( 'reload' );
                    
                    // ha az utolsó oldal, akkor nem jelenítjük meg a next-page-t
                    if(data.elemek_hatra > 0){
                        page++;
                        $('#next-page-img').attr('src', '<?php echo base_url(); ?>frontend_style/img/arrow-d.png');
                    }else{
                        // nincs több hír
                        $('#next-page-img').hide();
                    }
                    
                    $('.gridIt').imagesLoaded(function() {
                        $tumblelog.masonry({
                            columnWidth : 214,
                            isAnimated : true,
                            gutterWidth : 20
                        });
                    });
                },
                error: function(XMLHttpRequest, textStatus, errorThrown){
                    $("#no-pages-to-show").fadeIn();
                    console.log(textStatus + ': ' + errorThrown);
                }
            });
        }
        
        $('#next-page-url').click(function(){
            load_hirek(page);
            return false;
        });
        
        load_hirek();
        
        
    });
</script>